var city = "泊头";

function loadXMLDoc()
{
    var xmlhttp;
    if (window.XMLHttpRequest)
    {
        //  IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码
        xmlhttp=new XMLHttpRequest();
    }
    else
    {
        // IE6, IE5 浏览器执行代码
        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange=function()
    {
        if (xmlhttp.readyState==4 && xmlhttp.status==200)
        {
            let json = JSON.parse(xmlhttp.responseText);
            console.log(json);
            //获取城市
            let city = document.getElementById("#city");
            city = json.basic.city;


            //获取天气、时间、温度和风向
            let temp = json.daily_forecast;
            let da = document.querySelectorAll(".ti span");
            let time = document.querySelectorAll(".time span");
            let tem = document.querySelectorAll(".tem span");
            let tem1 = document.querySelectorAll(".tem i");
            let wind = document.querySelectorAll(".wind span");
            for(let t = 0;t<temp.length;t++){
                da[t].innerHTML=temp[t].cond.txt_d;
                time[t].innerHTML = temp[t].date;
                tem[t].innerHTML = temp[t].tmp.max;
                tem1[t].innerHTML = temp[t].tmp.min;
                wind[t].innerHTML = temp[t].wind.dir;

            }


            //分时段预报
            let hour = json.hourly_forecast;
            let bran = document.querySelectorAll(".bran span");
            console.log(bran);
            let win = document.querySelectorAll(".fen span");
            let ji = document.querySelectorAll(".ji span");
            for(let w = 0;w<bran.length;w++){
                bran[w].innerHTML = hour[w].date.slice(11,13);
                win[w].innerHTML = hour[w].wind.dir;
                ji[w].innerHTML = hour[w].wind.sc+"级";
           }


            //生活指数
            var a = document.querySelector(".a-1");
            var b = document.querySelector(".a-2");
            var c = document.querySelector(".a-3");
            var d = document.querySelector(".a-4");
            var e = document.querySelector(".a-5");
            var f = document.querySelector(".a-6");

            a.innerHTML = json.suggestion.uv.txt;
            b.innerHTML = json.suggestion.sport.txt;
            c.innerHTML = json.suggestion.flu.txt;
            d.innerHTML = json.suggestion.drsg.txt;
            e.innerHTML = json.suggestion.cw.txt;
            f.innerHTML = json.suggestion.air.txt;

            var a1 = document.querySelector(".b-1");
            var b1 = document.querySelector(".b-2");
            var c1 = document.querySelector(".b-3");
            var d1 = document.querySelector(".b-4");
            var e1 = document.querySelector(".b-5");
            var f1 = document.querySelector(".b-6");

            a1.innerHTML = json.suggestion.uv.brf;
            b1.innerHTML = json.suggestion.sport.brf;
            c1.innerHTML = json.suggestion.flu.brf;
            d1.innerHTML = json.suggestion.drsg.brf;
            e1.innerHTML = json.suggestion.cw.brf;
            f1.innerHTML = json.suggestion.air.brf;


            //document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
        }
    };
    xmlhttp.open("GET","http://bird.ioliu.cn/weather?city=" +city,true);
    xmlhttp.send();
}
loadXMLDoc();

document.querySelector("#pit").addEventListener('change',function(){
    city = this.value;
    document.querySelector("#city").innerHTML = city;
    loadXMLDoc();
});